const App = {
  data() {
    return {
      // grid_resource: {
      //   Grid_Resource_SerialNumber: "",//网格资源编号
      //   Grid_SerialNumber: "",
      //   Resource_Type: "",
      //   Coordinate: "",
      // },
      // grid_information: {
      //   Grid_SerialNumber: "",
      //   Grid_Name: "",
      //   Parent_Grid_SerialNumber: "",
      //   Grid_Level: "", //性别
      //   Coords: "", //户籍所在
      //   Responsible_Organization: ""
      // },
      dataForm: {},
      value: [], // 初始化 labelNumber 属性
      hjoptions: [], //省市区县
      Nation: [], //民族
      fileList: [], //身份证照片
      lsGrid_SerialNumber: [],
      Genderdata: [],
      lsPersonal_SerialNumber: [

      ],



    };
  },
  mounted() {
    this.queryIntiObject()
    this.grid()
    let ls_URL = window.location.href;
    const nodeKey = getQueryObject(ls_URL, "nodeKey")// 获取 nodeKey 参数
    const action = getQueryObject(ls_URL, "action");   // 获取 action 参数
    let ls_DistrictCode = getQueryObject(ls_URL, "DistrictCode");
    console.log('ls_DistrictCode', ls_DistrictCode);

    // 在这里可以使用 nodeKey 和 action 参数进行后续操作
    console.log('nodeKey:', nodeKey);
    console.log('action:', action);
    if (action === 'Add') {
      console.log('执行添加逻辑');
      // 执行添加逻辑，例如清空表单、设置默认值等

    } else if (action === 'Modify') {
      console.log('执行编辑逻辑');
      this.editgrid_member()
      this.queryGridInformationByGrid_SerialNumber()
    }
  },
  methods: {
    queryIntiObject() {
      let lJSONObject_Data_Options = new Object();
      lJSONObject_Data_Options = JSON.parse(document.getElementById("MainTable").getAttribute("data-options"));
      let ls_MainTableName = lJSONObject_Data_Options.TableName;
      $.ajax({
        headers: {
          "content-type": "application/x-www-form-urlencoded",
        },
        url: `${mh}/generalBusiness/generalQueryForIntiObject`,
        method: "post",
        data: {
          TableName: ls_MainTableName
        },
        success: (res) => {
          console.log(res);
          _this.dataForm = res[0]
          // console.log('  _this.grid_information', _this.grid_information);
        },
        error: (err) => {
          console.log(err);
        },
      });
    },
    queryGridInformationByGrid_SerialNumber() {
      const _this = this;

      let ls_URL = window.location.href;
      const nodeKey = getQueryObject(ls_URL, "nodeKey")// 获取 nodeKey 参数
      const action = getQueryObject(ls_URL, "action");   // 获取 action 参数
      // 在这里可以使用 nodeKey 和 action 参数进行后续操作
      console.log('nodeKey:', nodeKey);
      console.log('action:', action);

      //获得对应表单对象
      let lJSONObject_Data_Options = new Object();
      lJSONObject_Data_Options = JSON.parse(document.getElementById("MainTable").getAttribute("data-options"));
      let ls_DataForm = lJSONObject_Data_Options.form;
      // return;
      $.ajax({
        headers: {
          "content-type": "application/x-www-form-urlencoded",
        },
        url: `${mh}/generalBusiness/generalQueryByTableNameWithOriginal`,
        method: "post",
        data: {
          Data: "grid_information",
          Condition: `Grid_SerialNumber='${nodeKey}'`,
        },
        success: (res) => {
          console.log(res);
          _this[ls_DataForm] = res[0]
          console.log('  _this.grid_information', _this.grid_information);
        },
        error: (err) => {
          console.log(err);
        },
      });
    },
    // memberinform编辑
    editgrid_member() {
      let _this = this
      let ls_URL = window.location.href;
      const nodeKey = getQueryObject(ls_URL, "nodeKey")// 获取 nodeKey 参数
      const action = getQueryObject(ls_URL, "action");   // 获取 action 参数
      let ls_DistrictCode = getQueryObject(ls_URL, "DistrictCode");
      console.log('ls_DistrictCode', ls_DistrictCode);
      //获得对应表单对象
      let lJSONObject_Data_Options = new Object();
      lJSONObject_Data_Options = JSON.parse(document.getElementById("MainTable").getAttribute("data-options"));
      let ls_DataForm = lJSONObject_Data_Options.form;
      $.ajax({
        headers: {
          "content-type": "application/x-www-form-urlencoded",
        },
        url: `${mh}/generalBusiness/generalQueryByTableNameWithOriginal`,
        method: "post",
        data: {
          Data: "grid_patrol_task ", //表名
          Condition: `Grid_SerialNumber='${nodeKey}'`,
          // Condition: `${key}='${rowkey}'`,
        },
        success: (res) => {
          console.log('memberinform编辑', res);
          _this[ls_DataForm] = res[0]

        },
        error: (err) => {
          console.log(err);
        },
      });


    },
    // 获取所属网格
    grid() {
      let _this = this
      $.ajax({
        url: `${mh}/generalBusiness/generalQueryByTableNameWithOriginal`,
        method: "post",
        data: {
          Data: "grid_information",
          Condition: ""
        },
        success: (res) => {

          console.log(res);
          _this.Genderdata = res
          console.log('_this.lsGrid_SerialNumber', _this.lsGrid_SerialNumber);

        },
        error: (err) => {
          console.log(err);
        },
      });

    },
    gids() {

      $.ajax({
        url: `${mh}/generalBusiness/generalQueryByTableNameWithOriginal`,
        method: "post",
        data: {
          Data: "personal_information",
          Condition: ""
        },
        success: (res) => {
          let _this = this
          console.log(res);
          _this.lsPersonal_SerialNumber = res

        },
        error: (err) => {
          console.log(err);
        },
      });

    },


    //提交表单
    handleSubmit() {
      const _this = this;
      let ls_URL = window.location.href;
      const action = getQueryObject(ls_URL, "action");   // 获取 action 参数
      let lJSONObject_Data_Options = new Object();
      lJSONObject_Data_Options = JSON.parse(document.getElementById("MainTable").getAttribute("data-options"));
      let ls_MainTableName = lJSONObject_Data_Options.TableName;
      let ls_DataForm = lJSONObject_Data_Options.form;
      //建立新增提交结构
      let lJSONArray_Record = new Array();
      lJSONArray_Record.push(this[ls_DataForm]);
      let lJSONObject_Table = new Object();
      lJSONObject_Table[ls_MainTableName] = lJSONArray_Record;

      let lJSONObject_DataSet = new Object();
      lJSONObject_DataSet[action] = lJSONObject_Table;
      console.log('lJSONObject_DataSet', lJSONObject_DataSet);
      $.ajax({
        headers: {
          "content-type": "application/x-www-form-urlencoded",
        },
        url: `${mh}/generalBusiness/generalSave`,
        method: "post",
        data: {
          Data: JSON.stringify(lJSONObject_DataSet),
        },
        success: (res) => {
          console.log(res);
          // html跳转页面
          window.location.href = "grid_patrol_task.html";
        },
        error: (err) => {
          console.log(err);
        },
      });

    },
    AddApi(lJSONObject_DataSet) {
      console.log(lJSONObject_DataSet);
      const _this = this;
      $.ajax({
        url: `${mh}/clientOperation/generalSaveForClient`,
        method: "post",
        data: {
          Data: JSON.stringify(lJSONObject_DataSet),
        },
        success: (res) => {
          console.log(res);
          // 在普通 JavaScript 中使用 MessageBox
          ElMessage({
            message: "提交成功",
            type: "success",
            plain: true,
            duration: 1000, // 消息显示时长（毫秒）
          });
          // 等待 3 秒后回退页面
          setTimeout(() => {
            window.history.back();
          }, 1000);
        },
        error: (err) => {
          console.log(err);
        },
      });
    },
    handleChange(file, fileList) {
      const reader = new FileReader();
      reader.readAsDataURL(file.raw);
      reader.onload = () => {
        const base64Data = reader.result;
        console.log("Base64 编码的图片数据：", base64Data);
        const parts = base64Data.split("base64,");
        if (parts.length > 1) {
          var extractedData = parts[1];
          console.log(extractedData); //想要的数据
        } else {
          console.log("未找到 Base64 数据");
        }
        // return
        const _this = this;
        $.ajax({
          headers: {
            "content-type": "application/json",
          },
          url: `${mh}/clientOperation/parseIDCard`,
          method: "post",
          data: extractedData,
          success: (res) => {
            console.log(res);
            console.log(res.words_result[0].card_result);
            _this.personal_information.ID_Card_Number =
              res.words_result[0].card_result.公民身份号码.words;
            _this.personal_information.Personal_Name =
              res.words_result[0].card_result.姓名.words;
            _this.personal_information.Gender =
              res.words_result[0].card_result.性别.words;
            _this.personal_information.Registered_Residence =
              res.words_result[0].card_result.住址.words;
            _this.personal_information.Nation =
              res.words_result[0].card_result.民族.words;
            const birthStr = res.words_result[0].card_result.出生.words;
            if (birthStr.length === 8) {
              const formattedBirthday = `${birthStr.slice(
                0,
                4
              )}-${birthStr.slice(4, 6)}-${birthStr.slice(6)}`;
              _this.personal_information.Birthday = formattedBirthday;
            } else {
              console.log("出生日期格式不正确，应为 8 位数字");
            }
          },
          error: (err) => {
            console.log(err);
          },
        });
      };
      reader.onerror = () => {
        console.error("读取文件时出错");
      };
    },
    goBack() {
      window.history.back();
    },
  },
};
const { createApp, ref } = Vue;
const app = createApp(App);
app.use(ElementPlus);
//这种方式是引入全部图标，无需单个引入
for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
  app.component(key, component);
}
const ElMessage = ElementPlus.ElMessage;
app.mount("#app");
